<%@ page  import="java.util.*, SiTuQingYou.vo.*" language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%String path = request.getContextPath();%>
<!DOCTYPE HTML>
<html>
<head>
<title>首页</title>
<link href="css/bootstrap.css" rel="stylesheet" type="text/css" media="all">
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Freehold Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template, 
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyEricsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,800italic,800,700italic,700,600italic,600,400italic,300italic,300' rel='stylesheet' type='text/css'>
<script src="js/jquery-1.11.1.min.js"></script>
<script src="js/responsiveslides.min.js"></script>
 <script>
    $(function () {
      $("#slider").responsiveSlides({
      	auto: true,
      	nav: true,
      	speed: 500,
        namespace: "callbacks",
        pager: true,
      });
    });
    
  </script>
  <style type="text/css">
  .welcome
  {
  height:2050px;
  }
  .testimonials
  {
  
  margin-bottom: 0px;
  }
   #ulx>li
  {
   margin-left:10px;
   
   
  }
 
   #sceneclass
   {
   padding:0px;
  margin:0px;
  list-style:none;
   }
  #sceneclass>li>ul
  {
  
  padding:0px;
  margin:0px;
  list-style:none;
  }
  #sceneclass>li 
  {
  
  height:100%;
  float:right;
  width:31%;
  
  margin-left:20px;
  }
   #sceneclass>li>ul>li
   {
   
   margin:20px auto;
   }
   #sceneclass>li>ul>li>a>img
   {
   width:100%;
   height:150px;
   
   }
   .wel-grids
   {
   margin:0px auto;
    
    
   }
   .container
   {
    margin:0px auto;
   }
 #cover
 {
 margin:0 auto;
 border:1px solid gray;
 height:400px;
 }
   
           
 #cover>ul{
               margin-top: 0px;
               padding-left: 0px;
               list-style: none;
               position: absolute;
           }
           
 #cover>ul>li{
               float: left;
               width: 38px;
               height: 38px;
               border: 1px solid black;
               text-align: center;
               line-height: 38px;
               font-size: 20px;
              
           }
           #str
           {
           
           
           padding:auto;
           }
 #divs
 {
 margin-left:90px;
 width:930px;
 height:200px;
 margin-top:20px;
 }
#divleft
{
margin-left:10px;
float:left;
width:300px;
height:200px;

}
#divright
{
margin-left:10px;
float:left;
width:600px;
height:200px;

}
#title
{
text-align:center;

width:300px;
height:30px;
margin-left:100px;
}
#contentx
{
text-align:left;
height:65px;
font-size:15px;
margin-top:10px;

width:500px;
display:-webkit-box;
-webkit-box-orient:vertical;
-webkit-line-clamp:3;
overflow:hidden;
text-overflow:ellipsis;/* 支持 IE */
 
}
#contentx>a
{
text-decoration: none;
}
#author a
{
text-decoration: none;
}
#title>a
{
text-decoration: none;
}

#author
{
margin-top:50px;
 
width:600px;
height:30px;
 
}
#divleft img
{
width:100%;
height:100%;
}
#more
{
margin-top:20px;
width:1000px;
text-align: right;
}
#author span
{
float:right;
margin-right:10px;
}
#imgg
{
width:300px;
height:200px;
}
#writes
{
border-bottom:2px solid gray;
height:100px;
 margin-left:90px;
 width:930px;
}
#writes button
{
 float:right;
 margin-top:60px;
 height:40px;
 background-color:#FF8000;
 color:white;
 width:100px;
 display:inline-block;
 cursor: pointer;
 border: none;
 border-radius: 5px;
 font-family: fantasy;
 font-size: 15px;
}
#writes button:hover
{
 background-color:#FFD700;
}
#divright:hover
{
 background-color:#CD8C95;
}
  
  </style>
 
  <script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
  <!-- 拿出四个热门景点的id -->
  <script type="text/javascript">
  var ids = new Array(); //定义一数组
  var str="";
  $.ajax({
	  url:"<%=path%>/GetAllSceneServlet",
	  type:"post",
	  async: false,
	  data:"method=getTopHotScene",
	  success:function(mes){
		  str=mes;
		  str=str.substring(1);
		  ids = str.split(",");
	  }
	  });
</script>
  <!-- 拿着四个热门景点的id去获得图片 -->
<script type="text/javascript">
		var pics= new Array();
	    $.ajax({
	  	  url:"<%=path%>/GetAllSceneServlet",
	  	  type:"post",
	  	  async: false,
	  	  data:"method=getTopHotPhoto&str="+str,
	  	  success:function(mes){
	  		 mes=mes.substring(1);
	  		 pics=mes.split(",");
	  		  
	  	  }
	  	  });
        $(document).ready(jsz);
          function jsz()
          {
              var ulx=$("<ul></ul>");
              for(var i=0;i<pics.length;i++)
                  {
                      var lix=$("<li></li>");
                      ulx.append(lix);
                      lix.html(i+1);
                      lix.attr("id",i+1);
                      
                    
                  }
               
              $("#cover").append(ulx);
              
          }
          $(document).ready(wz);
          function wz()
          {
             var u=$("#cover").children("ul");
             var h=$("#cover").css("height");
             h=h.substring(0,h.length-2);
             u.css("margin-top",h-40);
             var w=$("#cover").css("width");
             w=w.substring(0,w.length-2);
             u.css("margin-left",w-40*pics.length);
          }
          var imgx;
          var n=0;
          var t;
          var a;
          $(document).ready(jtp);
          function jtp()
          {
        	  a=$("<a></a>");
        	  a.attr("href","script:void(0)")
              imgx=$("<img/>");
              imgx.attr("src","pic/"+pics[0]);
              imgx.attr("width","100%");
              imgx.attr("height","100%");
              a.html(imgx);
              $("#cover").append(a);
              
              
          }
          $(document).ready(gbtp);
          function gbtp()
          {
              imgx.attr("src","<%=path%>/images/"+pics[n]);
              a.attr("href","/SiTuQingYou/index/sceneinfo.jsp?id="+ids[n])
              n++;
              $("#cover").find("li").css("color","black");
              $("#"+n).css("color","red");
              if(n==pics.length)
                  {
                     n=0; 
                  }
             
              t=setTimeout("gbtp()",2000);
              
          }
          $(document).ready(joverx)
          function joverx()
          {
              $("#cover").find("li").mouseover(overx);
              $("#cover").find("li").mouseout(overy);
              
          }
          function overx()
          {
             clearTimeout(t);
             var num= $(this).html();
             $("#cover").find("li").css("color","black");        
             $("#"+num).css("color","red");
             imgx.attr("src","<%=path%>/images/"+pics[num-1]);
          }
          function overy()
          {
              t=setTimeout("gbtp()",2000);
          }
        
        
        
    
    </script>
    <!-- 收藏 -->
<script type="text/javascript">
$(document).ready(load);
function load()
{
   $(document).ready(function(){
	   $("span[id=col]").click(function(){
		  var id=$(this).attr("cid");
		  $.ajax(
				  {
					  url:"<%=path%>/MyCollectionServlet",
					  type:"post",
					  data:"method=checkStrategyCollectionServlet&id="+id,
					  success:function(mes){
						if(mes==2)
							{
							 location.href = "/SiTuQingYou/anotherLogReg/login.jsp";
							}
							if(mes==1)
						    	{
						    	alert("取消收藏")
						    	}
						    if(mes==0)
					    	{
					    	alert("收藏成功")
					    	}	
							}
				  });
		   
	   });
	   
   });
}
</script>
<!-- 写攻略 -->
<script type="text/javascript">
$(document).ready(function(){
	
	$("#writes").children().click(function(){
	     $.ajax({
	    	 url:"<%=path%>/StrategyServlet",
	    	 type:"post",
	    	 data:"method=checkLogin",
	    	 success:function(mes)
	    	 {
	    	 
	    		 if(mes==1)
	    			 {
	    			 location.href = "/SiTuQingYou/index/writeStrategy.jsp";
	    			 }
	    		 else
	    			 {
	    			 location.href = "/SiTuQingYou/anotherLogReg/login.jsp";
	    			 }
	    	 }
	     });
	});
	
});

</script>  
<!-- 点赞 -->
<script type="text/javascript">
$(document).ready(load);
function load()
{
   $(document).ready(function(){
	   $("span[id=lik]").click(function(){
		  var id=$(this).attr("cid");
		  var t=$(this);
		  var count=$(this).prev().html();
		  count=parseInt(count);
		  $.ajax(
				  {
					  url:"<%=path%>/MyCollectionServlet",
					  type:"post",
					  data:"method=checkStrategyLikeServlet&id="+id,
					  success:function(mes){
						  if(mes==2)
							{
							 location.href = "/SiTuQingYou/anotherLogReg/login.jsp";
							}
							if(mes==1)
						    	{
								count--;
								t.prev().html(count);
								t.children().css("color","black");
						    	 
						    	}
						    if(mes==0)
					    	{
						    count++;
						    t.prev().html(count);
						    t.children().css("color","red");
					    	}	
							}
				  });
		   
		   
	   });
	   
   });
}


</script>
<!-- 得出该攻略总赞数 -->
<script type="text/javascript">
$(document).ready(function(){
	 
	 var totals=$("span[id=total]");
	 var cids="";
		totals.each(function()
		{
		var cid=$(this).attr("cid");
		cids=cids+"&"+"cid="+cid;	
		});
	
	 $.ajax(
			  {
				  url:"<%=path%>/MyCollectionServlet",
				  type:"post",
				  data:"method=getManyToatalLike"+cids,
				  success:function(mes){
					   var str=mes;
					   str=str.substring(1);
					   var totalss=new Array();
					   totalss=str.split(",");
					   var i=0;
					   totals.each(function()
								{
								 $(this).html(totalss[i]);
								 i++;	
								});
					  
					  
						}
			  });
	
});
</script>
  
  
</head>
<body>
<jsp:include page="header.jsp"></jsp:include>
				<div id="cover" >
				</div>
				<div class="content">
					<div class="welcome">
				<jsp:include page="/ShowClassSceneServlet?method=showsceneclass"></jsp:include>	
						<div class="container">
							<h2>主题分类</h2>
				 <div class="wel-grids">		   
				<%ArrayList<SceneClass>scs=(ArrayList<SceneClass>)request.getAttribute("scs"); %>
				<ul id="sceneclass">
				<%for(int i=0;i<scs.size();i++)
				{
					%> 
					
					<li>
					<ul>
					<li><a href="<%=path%>/index/sceneByType.jsp?id=<%=scs.get(i).getId()%>&theme=<%=scs.get(i).getClassname() %>"><img src="<%=path%>/images/<%=scs.get(i).getClassphoto() %>" class="img-responsive" alt=""/></a></li>
					<li><a href="<%=path%>/index/sceneByType.jsp?id=<%=scs.get(i).getId()%>&theme=<%=scs.get(i).getClassname() %>"><h3><%=scs.get(i).getClassname() %></h3></a></li>
					</ul>
					</li>
				
				
				
					      <%}
				%>
				</ul>
				</div>
							
							
							
							
							 
					</div>
				<!--welcome-->
				<div class="copyrights">Collect from <a href="http://www.cssmoban.com/"  title="ç½ç«æ¨¡æ¿">ç½ç«æ¨¡æ¿</a></div>
				<!--feature-->
					<div class="feature">
						<div class="container">
							<h3>旅游攻略</h3>
							<div id="writes"><a href="script:void(0)"><button>写攻略</button></a></div>
							 <div id="str">
							 <jsp:include page="/StrategyServlet"><jsp:param value="getThreeStrategy" name="method"/></jsp:include>
							<%ArrayList<Strategy>strategys=(ArrayList<Strategy>)request.getAttribute("strategys");%>
							 
							<%
							for(int i=0;i<strategys.size();i++)
							{
							%> 
							<div id="divs">
							<div id="divleft"><a href="<%=path%>/index/strategyinformation.jsp?id=<%=strategys.get(i).getId()%>"><img src="<%=path%>/imagess/<%=strategys.get(i).getPhoto()%>"/></a></div>
							<div id="divright">
							<div id="title"><a href="<%=path%>/index/strategyinformation.jsp?id=<%=strategys.get(i).getId()%>"><h4><%=strategys.get(i).getTitle()%></h4>  </a></div>
							<div id="contentx"><a href="<%=path%>/index/strategyinformation.jsp?id=<%=strategys.get(i).getId()%>"><%=strategys.get(i).getContent() %></a></div>
							<div id="author"><span>by <%=strategys.get(i).getUser().getUsernickname()%></span> 
							<span id="col" cid="<%=strategys.get(i).getId()%>"><a href="script:void(0)">收藏</a></span>
							<span id="total" cid="<%=strategys.get(i).getId()%>">total</span>
							<span id="lik" cid="<%=strategys.get(i).getId()%>"><a href="script:void(0)">点赞</a></span>
							
							</div>
							</div>
							
							</div>
							
							
						  <%  
							}
							%>
						   <div id="more"><a href="<%=path%>/index/strategy.jsp"><h4>更多>> </h4></h4></a></div> 
						 
							 </div>
							 
						</div>
					</div>
				<!--feature-->
				<div class="testimonials">
					<div class="container">
						<h3>明星导游</h3>
						<div class="test-grids">
			<jsp:include page="/GuiderServlet"><jsp:param value="getSixGuider" name="method"/></jsp:include>
						
						<%
						ArrayList<Guider> guiders=(ArrayList<Guider>)request.getAttribute("guiders");
						for(int i=0;i<guiders.size();i++)
						{
							%>
							
							<div class="col-md-4 test-grid">
							     
								<img id="imgg" src="<%=path%>/GuiderHead/<%=guiders.get(i).getGuiderphoto() %>" class="img-responsive" alt=""/>
								<a href="script:void(0)"><h4><%=guiders.get(i).getGuiderrealname() %></h4></a>
								<p><%=guiders.get(i).getGuiderinfo() %></p>
							</div>
							
							<% 
						}
						
						
						
						%>
						
						
							 
						</div>
				 
					</div>
				</div>
				</div>
<jsp:include page="footer.jsp"></jsp:include>
</body>
</html>
